<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org/">
<head th:fragment="head">
    <meta charset="utf-8">
    <title>超市积分后台管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" th:href="@{/images/favicon.ico}" href="/templates/images/favicon.ico">
    <link rel="stylesheet" th:href="@{/lib/layui-v2.5.5/css/layui.css}"
          href="../../static/lib/layui-v2.5.5/css/layui.css"
          media="all">
    <link rel="stylesheet" th:href="@{/css/layuimini.css}" href="../../static/css/layuimini.css" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" href="../../static/css/public.css" media="all">
    <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}"
          href="../../static/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style id="layuimini-bg-color">

    </style>
</head>
<body class="layui-layout-body layuimini-all">
<div class="layui-layout layui-layout-admin">
    <!--头部-->
    <div class="layui-header header" th:fragment="nav">
        <div class="layui-logo layuimini-logo">
            <a href="">
                <img src="/images/logo.png" alt="logo">
                <h1>超市积分管理系统</h1>
            </a>
        </div>
        <a>
            <div class="layuimini-tool"><i title="展开" class="fa fa-outdent" data-side-fold="1"></i></div>
        </a>
        
        <ul class="layui-nav layui-layout-left layui-header-menu layui-header-pc-menu mobile layui-hide-xs">
            <li class="layui-nav-item layui-this" th:if="${session.user.role==0}">
                <a class="view_notice" href="javascript:;"><i class="fa fa-desktop"></i>查看公告</a>
            </li>
            <li class="layui-nav-item layui-this" th:if="${session.user.role==1}" data-menu="currency">
                <a th:href="@{/notice/page}" href="javascript:;"><i class="fa fa-desktop"></i>发公告</a>
            </li>
            <li class="layui-nav-item " th:if="${session.user.role==0}" data-menu="currency">
                <a th:href="@{/integration/my_score/}" href="javascript:void(0);" id="componentHeaderId">
                    <i class="fa fa-flag"></i> 我的积分</a>
            </li>

        </ul>
        <ul class="layui-nav layui-layout-right">

            <li class="layui-nav-item" lay-unselect>
                <a href="javascript:;" data-refresh="刷新"><i class="fa fa-refresh"></i></a>
            </li>

            <li class="layui-nav-item " th:fragment="userinfo">
                <a href="#">
                    <!--用户头像-->
                    <img class="avatar" th:src="${session.user.avatar}" src=""
                         style="height: 60px;width: 60px;border-radius: 30px;" alt="avatar">
                </a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="javascript:;" class="uploadAvatar">上传头像</a>
                    </dd>
                    <dd>
                        <a th:href="@{/user/get_info/}" href="javascript:;" data-content-href=""
                           class="updateInfo" data-title="基本资料"
                           data-icon="fa fa-gears">修改资料</a>
                    </dd>
                    <dd>
                        <a th:href="@{/user/get_question/}" href="javascript:;" data-title="修改密码"
                           class="rePwd" data-icon="fa fa-gears">修改密码</a>
                    </dd>
                    <dd>
                        <a href="javascript:;" class="login-out">退出登录</a>
                    </dd>
                </dl>
            </li>
            <li class="layui-nav-item layuimini-select-bgcolor mobile layui-hide-xs">
                <a href="javascript:;" data-bgcolor="配色方案"><i class="fa fa-ellipsis-v"></i></a>
            </li>
        </ul>
    </div>
    <!--左边栏-->
    <div class="layui-side layui-bg-black" th:fragment="left">
        <div th:if="${session.user.role==0}" class="layui-side-scroll layui-left-menu">
            <!--左边菜单栏列表-->
            <ul class="layui-nav layui-nav-tree layui-left-nav-tree layui-this">
                <li class="layui-nav-item">
                    <a th:href="@{/manager/index/(id=${session.user.role})}" href="#" class="layui-menu-tips"
                       data-type="tabAdd" data-mpi="m-p-i-1" data-one-page=""><i class="fa fa-home"></i><span
                            class="layui-left-nav"> 主页</span></a>
                </li>
                <li class="layui-nav-item">
                    <a href="####" class="layui-menu-tips"><i class="fa fa-clock-o"></i>
                        <span class="layui-left-nav"> 历史记录</span> <span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a th:href="@{/user/log_info/}" href="javascript:;" class="layui-menu-tips"
                               data-type="tabAdd" data-mpi="m-p-i-2"><i class="fa fa-hourglass-end"></i><span
                                    class="layui-left-nav"> 登录日志</span></a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/integration/getDetail(username=${session.user.username})}" href="javascript:void(0);"
                       class="layui-menu-tips" data-type="tabAdd"
                       data-mpi="m-p-i-1"
                       data-one-page="">
                        <i class="fa fa-pencil-square-o"></i>
                        <span class="layui-left-nav">积分明细</span>

                    </a>

                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;" class="layui-menu-tips"> <i class="fa fa-bullhorn"></i>
                        <span class="layui-left-nav"> 公告列表</span> <span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a th:href="@{/notice/list}" href="javascript:;" class="layui-menu-tips"
                               data-type="tabAdd" data-mpi="m-p-i-2"><i class="fa fa-bell"></i>
                                <span class="layui-left-nav"> 历史公告</span></a>
                        </dd>
                    </dl>
                </li>
            </ul>
        </div>

        <div th:if="${session.user.role==1}" class="layui-side-scroll layui-left-menu">
            <!--左边菜单栏列表-->
            <ul class="layui-nav layui-nav-tree layui-left-nav-tree layui-this">
                <li class="layui-nav-item">
                    <a th:href="@{/manager/index/(id=${session.user.role})}"
                       href="javascript:void(0);" class="layui-menu-tips"
                       data-type="tabAdd" data-mpi="m-p-i-1"><i class="fa fa-home"></i>
                        <span class="layui-left-nav"> 主页</span></a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:void(0);" class="layui-menu-tips"><i class="fa fa-clock-o"></i><span
                            class="layui-left-nav"> 历史记录</span> <span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a th:href="@{/user/log_info/}" href="javascript:;" class="layui-menu-tips"
                               data-type="tabAdd" data-mpi="m-p-i-2">
                                <i class="fa fa-hourglass-end"></i>
                                <span class="layui-left-nav"> 登录日志</span>
                            </a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/admin/user_page/}" href="javascript:void(0);" class="layui-menu-tips"
                       data-type="tabAdd" data-mpi="m-p-i-1"
                       data-one-page="">
                        <i class="fa fa-users"></i>
                        <span
                                class="layui-left-nav">会员信息管理
                        </span>

                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/product/list}" href="javascript:void(0);" class="layui-menu-tips" data-type="tabAdd"
                       data-mpi="m-p-i-1"
                       data-one-page="">
                        <i class="fa fa-shopping-cart"></i>
                        <span class="layui-left-nav">商品积分管理</span>

                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/integration/list}" href="javascript:void(0);" class="layui-menu-tips"
                       data-type="tabAdd" data-mpi="m-p-i-1"
                       data-one-page="">
                        <i class="fa fa-trophy"></i>
                        <span class="layui-left-nav">会员积分管理</span>

                    </a>

                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/notice/list}" href="javascript:void(0);" class="layui-menu-tips" data-type="tabAdd"
                       data-mpi="m-p-i-1"
                       data-one-page="">
                        <i class="fa fa-bullhorn"></i>
                        <span class="layui-left-nav">公告管理</span>

                    </a>

                </li>
            </ul>
        </div>
    </div>
    <!--中间部分-->
    <div class="layui-body">
        <div class="layuimini-content-page " style="background: url('../../static/images/welcome.jpeg')">

            <!--初始化中间内容 welcome页面-->
            <div id="content-mid" class="layui-container content">
                <h2 class="layui-container welcome"
                    style="position: center;left:200px; top: 150px;width: 800px;height: 30px;">尊敬的，<a href="#"><span
                        th:text="${session.user.username}">用户</span></a> 欢迎回来！
                </h2>
            </div>

        </div>
    </div>

</div>


<script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" src="../../static/lib/jquery-3.4.1/jquery-3.4.1.min.js"
        charset="utf-8"></script>
<script th:src="@{/lib/layui-v2.5.5/layui.js}" src="../../static/lib/layui-v2.5.5/layui.js?v=1.0.4"
        charset="utf-8"></script>

<script th:src="@{/lib/layui-v2.5.5/layui.all.js}" src="../../static/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script th:src="@{/js/lay-config.js}" src="../../static/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script type="text/javascript">
    var role = $("#roleVal").val();
    layui.use(['layer', 'layuimini'], function () {
        $('.login-out').on("click", function () {
            layer.msg('正在退出登录', function () {
                window.location = '/user/logout';
            });
        });
        /* layuimini.listen();*/
    });
    $(".view_notice").click(function () {
        $.get("/notice/getFirstNotice", function (result) {
            result = result.data;
            $(".publish h1").html(result.noticeTitle);
            $(".publish p").html(result.noticeContent);
            layer.open({
                type: 1
                , title: '公告' //不显示标题栏
                , closeBtn: false
                , area: '300px;'
                , shade: 0.8
                , id: 'notice-publish' //设定一个id，防止重复弹出
                , resize: false
                , btn: ['我知道了']
                , btnAlign: 'c'
                , moveType: 1 //拖拽模式，0或者1
                , content: $(".publish")

            });
        });
        /*  */
    });
    $(".uploadAvatar").click(function () {
        layer.open({
            type: 1
            , title: '上传头像' //不显示标题栏
            , closeBtn: 2
            , area: '300px;'
            , id: 'upload-avatar' //设定一个id，防止重复弹出
            , resize: false
            , btnAlign: 'c'
            , moveType: 1 //拖拽模式，0或者1
            , content: $(".magt3")

        });
        /*头像上传*/
        layui.use('upload', function () {
            var upload = layui.upload;
            var uploadInst = upload.render({
                elem: '#test1'
                ,auto:true

                , url: '/user/projectPictureUpload'
                , method: 'post'
                , accept: 'images'
                , acceptMime: 'image/*'
                , field: 'projectImg'
                ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        $("#demo1").attr('src',result);
                    })}
                , done: function (res) {
                    //如果上传失败
                    if (res.status == 1) {
                        return layer.msg('上传项目图片失败', {icon: 5});
                    }
                    //上传成功,获得图片地址
                    console.log(res.data);

                    $('.avatar').attr('src', res.data);
                    layer.closeAll();
                    // window.location.reload();
                }
                , error: function () {
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function () {
                        uploadInst.upload();
                    });
                }
            });
        });
    });



</script>
</body>
<!--公告框-->
<div class="publish" style="padding: 50px; line-height: 22px;
background-color: #393D49; color: #fff; font-weight: 300;">
    <h1></h1><br><br>
    <p>

    </p>
</div>

<!--上传头像框-->
<div class="layui-form layui-form-item magt3">

    <div class="layui-upload">
        <button type="button" class="layui-btn" style="margin-left: 100px;" id="test1">选择图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" id="demo1" style="margin-left:80px;width: 140px;height: 115px;">
            <p id="demoText"></p>
        </div>

    </div>

</div>


</html>
